<script lang="ts" setup>
import { NavBar } from 'vant';

const pages = [
  { title: '联系人', path: '/contacts', icon: 'contacts' },
  { title: '商品', path: '/materials', icon: 'box' },
  { title: '价格策略', path: '/price_policys', icon: 'price' },
  { title: '趋势', path: '/trends', icon: 'combo-chart' },
  { title: '监控', path: '/cctv', icon: 'camera' },
]

onMounted(() => {

})
</script>

<template>
<div>
  <NavBar
    title="全部功能"
  />

  <h3 mx4 my2>订单</h3>

  <div paper m2 pb0>
    <div flex flex-wrap>
      <LxEntry
        title="创建订单" icon="create-order"
        :action="() => $router.push('/orders/edit?template=0')"
        :grid="5"
      />
      <LxEntry
        :action="() => $router.push('/orders')"
        icon="order"
        title="全部订单"
        :grid="5"
      />
      <LxEntry
        :action="() => $router.push('/orders?invalid=1')"
        icon="recycle-bin"
        title="回收站"
        :grid="5"
      />
      <LxEntry
        :action="() => $router.push('/orders/archive')"
        icon="archive"
        title="往年订单"
        :grid="5"
      />
    </div>
  </div>

  <h3 mx4 my2>人事</h3>

  <div paper m2 pb0>
    <div flex flex-wrap>
      <LxEntry
        title="新事务" icon="calendar-plus"
        :action="() => $router.push('jobs/events/detail?event=1')"
        :grid="5"
      />
      <LxEntry
        :action="() => $router.push('/jobs')"
        icon="worker"
        title="人事"
        :grid="5"
      />
    </div>
  </div>

  <h3 mx4 my2>其他</h3>

  <div paper m2 pb0>
    <div flex flex-wrap>
      <LxEntry
        v-for="(app, ai) in pages" :key="ai"
        :action="() => $router.push(app.path)"
        :icon="app.icon"
        :title="app.title"
        :grid="5"
      />
    </div>
  </div>
</div>
</template>

<style scoped>

</style>
